import { Tabs } from "@chakra-ui/react";
import { ColorModeButton } from "@/components/ui/color-mode";
import { LuList, LuTable2 } from "react-icons/lu";
import AppTable from "./AppTable";
import ListBasic from "./AppList";

const AppTabs = () => {
  return (
    <Tabs.Root defaultValue="table">
      <Tabs.List>
        <Tabs.Trigger value="table">
          <LuTable2 />
          Table
        </Tabs.Trigger>
        <Tabs.Trigger value="lists">
          <LuList />
          Lists
        </Tabs.Trigger>

        <ColorModeButton />
      </Tabs.List>
      <Tabs.Content value="table">
        <AppTable />
      </Tabs.Content>
      <Tabs.Content value="lists">
        <ListBasic />
      </Tabs.Content>
    </Tabs.Root>
  );
};

export default AppTabs;
